<template>
	<view class="index_wrap">
		<view class="" style="background: linear-gradient(180deg, #447A05 0%, #f4f4f4 100%)">
			<view class="top-bar">
				<view class="top-cont">
					<view class="top-left">
						<image class="top-logo" src="../../static/image/logins.png"></image>
						<view class="top-title">助业业主端
							<!-- projectItem.proName -->
							<text
								style="color: rgb(227, 227, 231); margin-left: 3px; font-size: 15px;" v-show="proName">({{proName}})</text>
						</view>
					</view>
				</view>
			</view>
			<swiper :indicator-dots="true" :autoplay="true" :interval="2000" :duration="1000" circular class='a'>
				<swiper-item v-for="(item,index) in swiperArray" :key='index' @click="toLink() ">
					<view class="swiper-item">
						<image mode="widthFix" class='swiper_img' :src="item.imgUrl" />
					</view>
					<view class="down__Owner_App " v-show="index == 1">
						<view class="down_cont_btn">
							<u-button @click='downBtn' shape="circle" type="warning">下载APP</u-button>
						</view>
					</view>
				</swiper-item>
			</swiper>

		</view>
		<!-- 金刚区 -->
		<view class='index_vajra_district'>
			<view
				style="border-radius: 12px;background-color: rgba(249, 249, 249, 1);width: 95%;margin: 12px auto;padding-bottom: 30rpx;"
				v-if="type==='1'">
				<view style="padding-left: 13px;">
					<view class="title">公告公示
						<view class="title_btm"></view>
					</view>
				</view>

				<view class='index_vajra_district_box' v-for="(item,index) in vajraArray" :key="index"
					@click='tapName(item)'>
					<image mode="widthFix" :src="item.imgUrl" />
					<text style="color: #666666;">{{item.name}}</text>
				</view>
			</view>

			<view
				style="border-radius: 12px;background-color: rgba(249, 249, 249, 1);width: 95%;margin: 12px auto;padding-bottom: 30rpx;"
				v-if="type==2">
				<view style="padding-left: 13px;">
					<view class="title">日常操作
						<view class="title_btm"></view>
					</view>
				</view>
				<view class='index_vajra_district_box' v-for="(item,index) in vajraArray3" :key="index"
					@click='tapName(item)'>
					<image mode="widthFix" :src="item.imgUrl" />
					<text style="color: #666666;">{{item.name}}</text>
				</view>
			</view>

			<view
				style="border-radius: 12px;background-color: rgba(249, 249, 249, 1);width: 95%;margin: 12px auto;padding-bottom: 30rpx;"
				v-if="type==='3'">
				<view style="padding-left: 13px;">
					<view class="title">物业缴费
						<view class="title_btm"></view>
					</view>
				</view>
				<view class='index_vajra_district_box' v-for="(item,index) in vajraArray2" :key="index"
					@click='tapName(item)'>
					<image mode="widthFix" :src="item.imgUrl" />
					<text style="color: #666666;">{{item.name}}</text>
				</view>
			</view>
			<button class="back_btn" @click="gotoBack">返回</button>

		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				swiperArray: [{
						index: 1,
						imgUrl: 'http://clhy-img.oss-cn-beijing.aliyuncs.com/venusImage/2021-12-15/1639571200709.png',
					},
					{
						index: 2,
						imgUrl: 'http://clhy-img.oss-cn-beijing.aliyuncs.com/venusImage/2021-12-15/1639571251160.png',
					}
				],
				title: '素胚勾勒出青花，笔锋浓转淡',
				subTitle: '2020-05-15',
				thumb: 'http://pic2.sc.chinaz.com/Files/pic/pic9/202002/hpic2119_s.jpg',
				show: false,
				// 金刚区图片
				vajraArray: [{
						index: '1',
						name: '通告公告',
						imgUrl: '../../static/index/tzgg.png',
						link: '/pages/authentication/newNoticeList'
					},
					{
						index: '2',
						name: '工作公示',
						imgUrl: '../../static/index/gggs.png',
						link: '/pages/publicity/publicity'
					},
					{
						index: '3',
						name: '财务公示',
						imgUrl: '../../static/index/gwgs.png',
						link: '/pages/finance/finance'
					},
					// {
					// 	index: '4',
					// 	name: '账单',
					// 	imgUrl: '../../static/image/bill.png',
					// 	link: '/pages/bill/bill'
					// },
					{
						index: '5',
						name: '小区资料',
						imgUrl: '../../static/index/xqzl.png',
						link: '/pages/community/communityindex'
					},
					{
						index: '6',
						name: '失物招领',
						imgUrl: '../../static/index/swzl.png',
						link: '/pages/lostarticle/lostarticle'
					},
					{
						index: '7',
						name: '制度流程',
						imgUrl: '../../static/index/lc.png',
						link: '/pages/technological/process'
					},
					{
						index: '8',
						name: '物业合同',
						imgUrl: '../../static/index/contract.png',
						link: '/pages/contract/contractindex'
					},
					{
						index: '9',
						name: '小区员工',
						imgUrl: '../../static/index/xqyg.png',
						link: '/pages/personnel/personnelindex'
					}

				],
				vajraArray3: [{
						index: '1',
						name: '报修',
						imgUrl: '../../static/index/bx.png',
						link: '/pages/guarantee/guarantee'
					},
					{
						index: '2',
						name: '装修管理',
						imgUrl: '../../static/index/zzgl.png',
						link: '/pages/renovation/renovationindex'
					},
					{
						index: '3',
						name: '保险理赔',
						imgUrl: '../../static/index/bxlp.png',
						link: '/pages/yeInsurance/indexlnsurance'
					},
					{
						index: '4',
						name: '诉讼记录',
						imgUrl: '../../static/index/ss.png',
						link: '/pages/user/litigationIndex'
					},
					{
						index: '5',
						name: '开门',
						imgUrl: '../../static/index/km.png',
						// link: '/pages/personnel/personnelindex'
					},
					{
						index: '6',
						name: '监控查询',
						imgUrl: '../../static/index/jkgl.png',
						// link: '/pages/personnel/personnelindex'
					}

				],
				vajraArray2: [{
						index: '1',
						name: '物业费',
						imgUrl: '../../static/index/wyf.png',
						// link: '/pages/pay/pay'
						link: '/pages/wuyepay/wuyepay'
					},
					{
						index: '2',
						name: '维修',
						imgUrl: '../../static/index/wxf.png',
						link: '/pages/repairList/repairList'
					},
					{
						index: '3',
						name: '车位费',
						imgUrl: '../../static/index/cwf.png',
						link: '/pages/pay/parking'
					},
					{
						index: '4',
						name: '暖气费',
						imgUrl: '../../static/index/nqf.png',
						link: '/pages/heating/heating'
					},

					{
						index: '5',
						name: '水费',
						imgUrl: '../../static/index/sdf.png',
						link: '/pages/forwater/forWater'
					},
					{
						index: '6',
						name: '电费',
						imgUrl: '../../static/index/df.png',
						link: '/pages/forwater/forElectricity'
					},
					{
						index: '7',
						name: '制冷费',
						imgUrl: '../../static/index/zlf.png',
						link: '/pages/heating/colding'
					}

				],
				housingFlag: false,
				hourseList: null,
				hourseStr: null,
				hourseNum: 0, //选择第几个房间,
				bol: false, //弹窗
				PopupList: [],
				index: 0,
				proName: uni.getStorageSync('projectItem').proName
			}
		},
		onLoad(options) {
			console.log(options)
			if (options.type) {
				this.type = options.type;
				console.log(this.type)
			}
			this.bol = !this.bol
		},
		// onLoad() {

		// },
		async onShow() {
			let res = await this.$request.api.address({})
			// console.log(console.log(res))
			this.login()
			this.hourseNum = uni.getStorageSync('hourseNum') || 0
			this.housingFlag = false
			if (uni.getStorageSync('loginFlag')) {
				this.getHouseList()
			}
			// this.getPopupList()
		},
		methods: {
			gotoBack() {
				uni.navigateBack(1)
				console.log('1111111111')
			},
			newly() {
				uni.navigateTo({
					url: '/pages/information/informationindex'
				})
			},
			downBtn() {
				//应用宝链接
				// location.href='https://a.app.qq.com/o/simple.jsp?pkgname=uni.UNI21DD88C'
				//华为市场链接
				location.href =
					'https://appgallery.huawei.com/app/C104867875?sharePrepath=ag&locale=zh_CN&source=appshare&subsource=C104867875&shareTo=weixin&shareFrom=appmarket';
				//vivo链接
				//https://h5coml.vivo.com.cn/h5coml/appdetail_h5/browser_v2/index.html?appId=3319176&resource=301&source=2
			},
			//淘宝链接
			toLink() {

				// #ifdef H5
				window.open(
					'https://item.taobao.com/item.htm?spm=a230r.1.14.1.79c116cdEAqC10&id=661953804169&ns=1&abbucket=15#detail'
				)
				// #endif
				plus.runtime.openURL(
					'https://item.taobao.com/item.htm?spm=a230r.1.14.1.79c116cdEAqC10&id=661953804169&ns=1&abbucket=15#detail',
					function(res) {
						console.log(res);
					});


			},
			//获取房屋信息
			async getHouseList() {
				let res = await this.$request.api.house({
					mobile: uni.getStorageSync('phone')
				})
				console.log(123123)
				// console.log(res, uni.getStorageSync('phone'))
				if (res.data.data.projectList.length > 0) {
					this.hourseList = res.data.data.projectList
					this.hourseStr = this.hourseList[this.hourseNum]
					uni.setStorageSync('hourseList', res.data.data.projectList)
					console.log('有房屋列表')
					// uni.showModal({
					// 	title: '停水通知',
					// 	content: '尊敬的王某某\n撒娇看见啊还是看的啊那看见你的看书看见那看见那看看看看见看点看点看看见那看你卡技能看看看点看 \n特此通知\n2020年1月3日\n通知人（赵飞）',
					// 	showCancel: false,
					// 	confirmText: '已读',
					// 	confirmColor: '#F9A832',
					// 	success: function(res) {
					// 		if (res.confirm) {
					// 		}
					// 	}
					// });
					this.housingFlag = true
				} else {
					this.housingFlag = false
				}
			},
			//获取openId
			login() {
				let _this = this;
				// 检查登录状态是否过期
				// uni.checkSession({
				// 	fail: res => {
				// uni.login({
				// 	provider: 'weixin',
				// 	success: loginRes => {
				// 		uni.setStorageSync('code', loginRes.code);
				// 		_this.$request.api.login({
				// 			code: loginRes.code
				// 		}).then(res => {
				// 			uni.setStorageSync('openId', res.data.data.data.openId);
				// 			uni.setStorageSync('sessionKey', res.data.data.data.sessionKey);
				// 		});
				// 	}
				// })
				// 	}
				// })
			},
			// 金刚区切换
			tapName(item) {
				(item.index == 1 || item.index == 2) && this.$Router.pushTab({
					path: item.link
				})
				// uni.navigateTo({
				// 	url: item.link
				// })
				if (item.link) {
					uni.navigateTo({
						url: item.link
					})
				} else {
					console.log("Dsadsa")
					uni.showToast({
						icon: 'none',
						title: '暂未开放'
					})
				}

			},
			// 切换房屋
			estate() {
				this.$Router.push({
					path: '/pages/switch/switch'
				})
			},
			// 业主认证
			renBtn() {
				let _this = this;
				if (uni.getStorageSync('phone')) {
					if (uni.getStorageSync('loginFlag')) {
						_this.$Router.push({
							path: '/pages/address/address'
						})
					} else {
						uni.showModal({
							title: '请先实名认证',
							showCancel: false,
							confirmText: '确认',
							confirmColor: '#F9A832',
							success: function(res) {
								if (res.confirm) {
									_this.$Router.push({
										path: '/pages/realName/realName'
									})
								}
							}
						});
					}
				} else {
					uni.showModal({
						title: '请先登录',
						showCancel: false,
						confirmText: '确认',
						confirmColor: '#F9A832',
						success: function(res) {
							if (res.confirm) {
								console.log('a')
								_this.$Router.pushTab({
									path: '/pages/user/user'
								})
							}
						}
					});
				}
			},
			//弹窗
			dd() {
				console.log(this.bol)
				this.bol = !this.bol
			},
			cancel() {
				console.log(this.bol)
				this.bol = !this.bol
			},
			// async getPopupList() {
			// 	let res = await this.$request.api.Popup({
			// 		user_id: 2733
			// 		// mobile: uni.getStorageSync('phone')
			// 	})
			// 	this.PopupList = res.data.data.datalist
			// 	console.log(res.data.data.datalist)
			// }
		}
	}
</script>

<style scoped>
	.top-bar {
		padding-top: 88rpx;
		height: 88rpx;
		/* position: fixed; */
		top: 0;
		z-index: 1000;
		width: 100%;
		/* background: #ffffff; */
		/* border-bottom: 2rpx solid #eeeeee; */
		box-sizing: content-box;
	}

	.top-cont {
		text-align: center;
		// line-height: 88rpx;
		font-size: 36rpx;
		/* font-family: PingFangSC-Medium, PingFang SC; */
		font-weight: 500;
		color: #333;
		position: relative;
		display: flex;
		justify-content: space-between;
		align-items: center;
		/* background: #447A05; */
	}

	.top-left {
		display: flex;

		// align-items: center;
	}

	.top-logo {
		width: 36px;
		height: 34px;
		border-radius: 10rpx;
		margin-left: 36rpx;
		margin-right: 26rpx;
		margin-top: 7px;
	}

	.top-title {
		font-size: 22px;
		font-weight: 600;
		color: #FFFFFF;
		padding-top: 20rpx;

		// font-family: "\534E\6587\65B0\9B4F";//华文新魏字体无效
		// font-family: "\534E\6587\884C\6977";
		font-family: "STKaiti" ! important;
	}


	.top-img {
		width: 29px;
		height: 23px;
		position: absolute;
		right: 26rpx;
		top: 63%;
		transform: translateY(-50%);
	}

	.title {
		font-size: 18px;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: bold;
		font-weight: 500;
		color: #333333;
		line-height: 41px;
		position: relative;
	}

	.title_btm {
		position: absolute;
		width: 79px;
		height: 6rpx;
		// background: #578ae2;
		opacity: 0.6;
		border-radius: 6px;
		bottom: 4rpx;
		left: 6rpx;
		background: linear-gradient(70deg, #447A05, rgba(69, 124, 5, 0.1));

	}

	.u-m-b-20 {
		margin-bottom: 20px !important;
	}

	.rect {
		width: 80%;
		height: auto;
		background-color: #FFFFFF;
	}

	.index_wrap {
		width: 100vw;
		height: auto;
		overflow: hidden;
	}

	.index_wrap .a {
		width: calc(100vw - 60rpx);
		margin: 16px auto 20rpx;
		height: 36vw;
		border-radius: 6px;
		overflow: hidden;
	}

	.index_wrap .a .swiper_img {
		width: 100%;
	}

	.index_wrap .message {
		width: calc(100vw - 60rpx);
		margin: auto;
		height: 90rpx;
		border-radius: 12rpx;
		/* background: #FEF6EB; */
		background-color: rgba(69, 124, 5, 0.1);
		overflow: hidden;
	}

	.index_wrap .message .message_icon {
		width: 32rpx;
		height: 32rpx;
		float: left;
		margin: 26rpx 0 0 26rpx;
		background-size: 100%;
	}

	.index_wrap .message .message_icon image {
		/* width: 100%; */
		width: 18px;
		height: 16px;
		background: url(https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng38f723fe95702b94baafc7637bd5a9f079c1429fc7e4032de9c212da0ab25399) 0px 0px no-repeat;
		margin-top: 3px;
	}

	.index_wrap .message .message_swiper {
		float: left;
		width: calc(100% - 80rpx);
		margin: auto;
		height: 32rpx;
		margin: 25rpx 0 30rpx 20rpx;
	}

	.index_wrap .message .message_swiper .message_swiper_text {
		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
		font-size: 28rpx;
		color: #447A05;
	}

	.index_wrap .index_vajra_district {
		width: 100%;
		margin: auto;
		/* height: 600rpx; */
		/* display: flex; */
		justify-content: space-around;
		/* margin-top: 60rpx;
		margin-left: 24rpx; */
	}

	.index_wrap .index_vajra_district .index_vajra_district_box {
		width: 174rpx;
		height: 150rpx;
		display: inline-block;
		text-align: center;
		margin-top: 10px;
	}

	.index_wrap .index_vajra_district .index_vajra_district_box image {
		width: 52px;
		margin: auto;
	}

	.index_wrap .index_vajra_district .index_vajra_district_box text {
		display: inline-block;
		width: 100%;
		font-size: 24rpx;
		color: #FABE4B;
		text-align: center;
	}

	.index_wrap .index_btom {
		width: 100vw;
		height: auto;
		overflow: hidden;
		background: #FAFAFA;
	}

	.index_wrap .index_resi_quar {
		width: 100vw;
		height: 614rpx;
		position: relative;
	}

	.index_wrap .index_resi_quar .index_resi_quar_box {
		width: 100vw;
		height: 120rpx;
		background: #F1F1F1;
	}

	.index_wrap .index_resi_quar .index_resi_quar_cont {
		width: calc(100% - 60rpx);
		height: calc(100% - 60rpx);
		position: absolute;
		top: 20rpx;
		left: 30rpx;
		background: #fff;
		border-radius: 12rpx;
		box-shadow: 0px 3px 20px 0px rgba(51, 51, 51, 0.1);
	}

	.index_wrap .index_resi_quar .index_resi_quar_cont .index_resi_quar_cont_title {
		width: calc(100% - 40rpx);
		height: 90rpx;
		margin: auto;
		border-bottom: 1px solid #ddd;
		font-size: 36rpx;
		font-weight: 550;
		color: #333;
		line-height: 100rpx;
	}

	.index_wrap .index_resi_quar .index_resi_quar_cont .index_resi_quar_cont_title .index_resi_quar_cont_title_right {
		font-size: 24rpx;
		color: #2986FF;
		height: 28rpx;
		float: right;
		margin: 6rpx 20rpx 0 0;
	}

	.index_wrap .index_btom .index_resi_quar .index_resi_quar_cont .index_resi_quar_cont_cent {
		width: 100%;
		height: calc(100% - 91rpx);
		overflow: hidden;
	}

	.index_wrap .index_btom .index_resi_quar .index_resi_quar_cont .index_resi_quar_cont_cent .index_resi_quar_cont_cent_txt {
		width: 100%;
		height: auto;
		text-align: center;
		margin: 90rpx 0 0;
	}

	.index_wrap .index_btom .index_resi_quar .index_resi_quar_cont .index_resi_quar_cont_cent .index_resi_quar_cont_cent_btn {
		width: 370rpx;
		height: 90rpx;
		margin: 40rpx auto 0;
	}

	.index_wrap .index_resi_quar .index_resi_quar_cont .index_resi_quar_cont_cent .index_resi_quar_cont_cent_btn button {
		width: 100%;
		height: 100%;
		background: #F9A832;
		line-height: 90rpx;
		border-radius: 50rpx;
	}

	.index_wrap.index_resi_quar2 {
		width: 100%;
		height: auto;
		min-height: 60rpx;
		background: #FBFBFB;
	}

	.index_wrap .index_resi_quar2 .index_resi_quar2_gg {
		width: calc(100% - 60rpx);
		height: 250rpx;
		margin: 60rpx auto 60rpx;
	}

	.index_wrap .index_resi_quar2 .index_resi_quar2_gg image {
		width: 100%;
		height: 100%;
	}

	.index_wrap .index_gong {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		background: rgba(0, 0, 0, 0.3);
		z-index: 1000;
	}

	.index_wrap .index_gong .index_gong_cont {
		width: 670rpx;
		height: 792rpx;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		border-radius: 6px;
		background: #fff;
	}

	.mack {
		width: 100%;
		height: 100%;
		background-color: rgb(126, 123, 123);
		position: fixed;
		left: 0;
		top: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 55555;
	}

	.mack_box {
		width: 60%;
		min-height: 400rpx;
		background-color: #FFFFFF;
		padding: 20rpx;
		border-radius: 10rpx;
	}

	.notice {
		font-size: 30rpx;
		letter-spacing: 2rpx;
		line-height: 60rpx;
		border: #CCCCCC;
		color: #333333;
	}

	.respect {
		font-size: 30rpx;
		letter-spacing: 2rpx;
		line-height: 60rpx;
		color: #333333;
	}

	.boxMain {
		font-size: 24rpx;
		line-height: 30rpx;
	}

	.once {
		width: 60%;
		padding: 20rpx 60rpx;
		line-height: 40rpx;
		text-align: center;
		color: #F9A832;
		border: 2rpx solid #F9A832;
		border-radius: 50rpx;
		margin: 30rpx auto;
	}

	.down__Owner_App {
		width: 750rpx;
		height: 422rpx;
		/* background: url(../../static/image/owner.png); */
		background-size: 100%;
		/* position: relative; */
	}

	.down_cont_btn {
		position: absolute;
		width: 180rpx;
		height: 60rpx;
		top: 200rpx;
		left: 40rpx;
	}

	.u-btn {
		width: 100%;
		height: 100%;
	}

	.back_btn {
		margin-top: 100rpx;
		/* margin: 0 50rpx; */
		width: 80%;
		height: 88rpx;
		border-radius: 44rpx;
		line-height: 88rpx;
		color: #fff;
		background: linear-gradient(rgb(118, 217, 4) 0%, rgb(65, 117, 5) 100%);
		border: none;
	}
</style>